<template>
    <!-- 消息 -->
    <div style="min-width:809px">
        <div>
            <div class="vs-table-box">
                <el-table v-loading="loading" :data="tableData" header-row-class-name="has-gutter-table" style="width: 100%">
                    <el-table-column prop="content" label="消息描述">
                        <template slot-scope="scope">
                           <span @click="setRow(scope.row)" :class="scope.row.status == 1 ? 'pls' : 'tab-table-text'">{{scope.row.content}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column prop="create_time" label="创建时间"> </el-table-column>
                </el-table>
                <div class="vs-paging-box">
                    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="paging.page" :page-size="paging.limit" layout="sizes,prev, pager, next, jumper" :total="paging.total">
                    </el-pagination>
                </div>
            </div>
        </div>
        <router-view></router-view>
    </div>
</template>

<script>
import store from '@/store'
export default {
    data() {
        return {
            recordList: [],
            loading: false,
            loading2: false,
            isBtn: false,
            isInfo: false,
            dialogVisible: false,
            paging: {
                username: '',//姓名
                start_time: '',//开始时间
                end_time: '',//结束时间
                page: 1,
                total: 0,
                limit: 10,
            },
            form: {
                date: "",
            },
            tableData: []
        };
    },
    created() {
        this.handleCurrentChange(1);
    },
    methods: {
        async setRow(row) {
            switch(row.type){
                // 订单消息
                case 1:
                    break;
                // 订单退款
                case 2:
                    break;
                // 品牌申请
                case 3:
                    await this.$Http.messageRead({id: row.id});
                    store.dispatch('user/messageFun')
                    this.utils.goUrl('/trademark')
                    break;
                default:
                    break;
            }
        },
        async repairGetList() {
            this.loading = true;
            let { code, data } = await this.$Http.getMessage(this.paging);
            this.loading = false;
            if (code) {
                this.tableData = data.data;
                this.paging.total = data.total;
            }
        },
        handleSizeChange(val) {
            this.paging.limit = val;
            this.repairGetList()
        },
        handleCurrentChange(val) {
            this.paging.page = val;
            this.repairGetList()
        }
    },
};
</script>

<style lang="scss" scoped>
.image-thumbnail {
    width: 130px;
    height: 130px;
}
.pls{
    color: #666;
}
.tab-table-text{
    padding: 0;
}
</style>